<div class="row">
  <div class="large-6 columns">
    <h4>{{cluster.fabric}} :: {{cluster.name}}</h4>
    <table style="width: 100%">
      <thead>
        <tr>
          <th>Setting</th>
          <th>Value</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="(key, value) in cluster.settings">
          <td>{{key}}</td>
          <td>{{value}}</td>
        </tr>
      </tbody>
    </table>
  </div>
  <div class="large-6 columns">
    <a style="float: right;" href="#/">Back</a>
    <h4>Tables</h4>
    <table style="width: 100%">
      <thead>
        <tr>
          <th>Name</th>
          <th>Type</th>
          <th></th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="table in cluster.tables">
          <td>{{undecorate(table.name)}}</td>
          <td>{{table.type}}</td>
          <td><a style="float: right;" href="{{table.url}}">Info</a></td>
        </tr>
      </tbody>
    </table>
    <a class="button tiny" href="#/fabric/{{cluster.fabric}}/{{cluster.name}}/createTable">Create Table</a>
    <a class="button tiny" href="#/fabric/{{cluster.fabric}}/{{cluster.name}}/createSchema">Create Schema</a>
    <h4>Nodes</h4>
    <table style="width: 100%">
      <thead>
        <tr>
          <th>Name</th>
          <th>Type</th>
          <th>State</th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="node in cluster.nodes">
          <td>{{node.name}}</td>
          <td>{{node.type}}</td>
          <td><span class="label radius {{node.label}}">{{node.state}}</span></td>
        </tr>
      </tbody>
    </table>
  </div>
</div>
